import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:moose_app/core/utils/navigate_util.dart';
import 'package:moose_app/ui/values/values.dart';
import 'package:photo_view/photo_view.dart';
import 'package:photo_view/photo_view_gallery.dart';

class GalleryScreen extends StatefulWidget {
  GalleryScreen({
    this.loadingBuilder,
    this.backgroundDecoration,
    this.minScale,
    this.maxScale,
    this.initialIndex,
    @required this.galleryItems,
    this.scrollDirection = Axis.horizontal,
  }) : pageController = PageController(initialPage: initialIndex);

  final LoadingBuilder loadingBuilder;
  final Decoration backgroundDecoration;
  final PageController pageController;
  final List<GalleryItem> galleryItems;
  final Axis scrollDirection;

  final dynamic minScale;
  final dynamic maxScale;
  final int initialIndex;

  @override
  State<StatefulWidget> createState() => _GalleryScreenState();
}

class _GalleryScreenState extends State<GalleryScreen> {
  int currentIndex;

  @override
  void initState() {
    super.initState();
    currentIndex = widget.initialIndex;
  }

  void onPageChanged(int index) {
    setState(() {
      currentIndex = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Stack(
          alignment: Alignment.bottomRight,
          children: <Widget>[
            PhotoViewGallery.builder(
              scrollPhysics: const BouncingScrollPhysics(),
              builder: _buildItem,
              itemCount: widget.galleryItems.length,
              loadingBuilder: widget.loadingBuilder,
              backgroundDecoration: widget.backgroundDecoration,
              pageController: widget.pageController,
              onPageChanged: onPageChanged,
              scrollDirection: widget.scrollDirection,
            ),
            Container(
              padding: EdgeInsets.only(bottom: kSize60, right: kSize30),
              child: Text(
                "第 ${currentIndex + 1} 张",
                style: TextStyle(fontSize: kSize30, color: Colors.white),
              ),
            )
          ],
        ),
      ),
    );
  }

  PhotoViewGalleryPageOptions _buildItem(BuildContext context, int index) {
    final GalleryItem item = widget.galleryItems[index];
    return PhotoViewGalleryPageOptions.customChild(
      child: GestureDetector(
        onTap: () {
          if (Navigator.canPop(context)) {
            ATHNavigator.pop(context);
          }
        },
        child: CachedNetworkImage(imageUrl: item.resource),
      ),
      initialScale: PhotoViewComputedScale.contained,
      minScale: PhotoViewComputedScale.contained * (0.5 + index / 10),
      maxScale: PhotoViewComputedScale.covered * 3,
      heroAttributes: PhotoViewHeroAttributes(tag: item.id),
    );
  }
}

class GalleryItem {
  final String id;
  final String resource;
  final bool isSvg;

  GalleryItem({this.id, this.resource, this.isSvg = false});
}

List<GalleryItem> galleryItems = <GalleryItem>[
  GalleryItem(
    id: "tag1",
    resource:
        "https://gitee.com/shizidada/moose-resource/raw/master/moose/banner/1.jpg",
  ),
  GalleryItem(
      id: "tag2",
      resource:
          "https://gitee.com/shizidada/moose-resource/raw/master/moose/banner/2.jpg"),
  GalleryItem(
    id: "tag3",
    resource:
        "https://gitee.com/shizidada/moose-resource/raw/master/moose/banner/3.jpg",
  ),
  GalleryItem(
    id: "tag4",
    resource:
        "https://gitee.com/shizidada/moose-resource/raw/master/moose/banner/4.jpg",
  ),
  GalleryItem(
    id: "tag5",
    resource:
        "https://gitee.com/shizidada/moose-resource/raw/master/moose/banner/5.jpg",
  ),
];
